import React, { useEffect, useState } from 'react'
import { Badge, Descriptions, Card,Button } from 'antd';
import { useNavigate, useParams } from 'react-router-dom';

//引入查看医院详情的请求
import {getHosDetailsRequest} from '@api/hospital/hospitalList'

//引入获取数据的类型
import type {hospitalDetailReturnType,hospitalListItemsType} from '@api/hospital/model/hospitalListType'


export default function HospitalShow() {
 const navigate = useNavigate()
  const {id} = useParams()
  // console.log(id,'showid');

  //保存请求回来的医院详情数据
  const [hospitalShow,setHospitalShow] = useState<hospitalDetailReturnType>({})
  console.log(hospitalShow,'11');
  

  //进入页面刷新请求
  useEffect(()=>{
    
    const getHosDetails = async()=>{
      const re = await getHosDetailsRequest(id as string)
      
      setHospitalShow(re)
    }
    getHosDetails();
  },[])


  return (
    <Card>
      <Descriptions title="基本信息" bordered column={2}>
        <Descriptions.Item label="医院名称">{(hospitalShow.hospital)?.hosname}</Descriptions.Item>
        <Descriptions.Item label="医院logo">{(hospitalShow.hospital)?.logoData ? 
              (<img width={100} src={`data:image/jpeg;base64,${(hospitalShow.hospital)?.logoData}`}alt=""/>) : ("")}
        </Descriptions.Item>
        <Descriptions.Item label="医院编码">{(hospitalShow.hospital)?.hoscode}</Descriptions.Item>
        <Descriptions.Item label="医院地址">{(hospitalShow.hospital)?.param.fullAddress}</Descriptions.Item>
        <Descriptions.Item label="医院坐车路线" span={2}>
        {(hospitalShow.hospital)?.route}
        </Descriptions.Item>
        <Descriptions.Item label="医院简介" span={2}>
        {(hospitalShow.hospital)?.intro}
        </Descriptions.Item>
      </Descriptions>

      <Descriptions
        title="预约规则信息"
        bordered
        column={2}
        style={{ marginTop: "30px" }}
      >
        <Descriptions.Item label="预约周期">{(hospitalShow.bookingRule)?.cycle}</Descriptions.Item>
        <Descriptions.Item label="放号时间">{(hospitalShow.bookingRule)?.releaseTime}</Descriptions.Item>
        <Descriptions.Item label="停挂时间">{(hospitalShow.bookingRule)?.stopTime}</Descriptions.Item>
        <Descriptions.Item label="退号时间">{(hospitalShow.bookingRule)?.quitTime}</Descriptions.Item>
        <Descriptions.Item label="预约规则" span={2}>
        {(hospitalShow.bookingRule)?.rule.map((item,index)=>{
          return <p key={index}>{item}</p>
        })}
        </Descriptions.Item>
      </Descriptions>

      <Button onClick={()=>{navigate(-1)}} style={{ marginTop: "30px" }} >返回</Button>
    </Card>
  )
}
